'use strict'

import HufuEcharts from './index.jsx'

/**
 * 柱状图表，继承至HufuEcharts
 */
export default class HufuEchartsBar extends HufuEcharts {
  constructor(props) {
    super(props)
    this.options = {
      color: ['#0084FF'],
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          // 坐标轴指示器，坐标轴触发有效
          type: 'shadow', // 默认为直线，可选为：'line' | 'shadow'
        },
        formatter: '{b0}<br /> {a0}:{c0}%<br />',
      },
      grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true,
      },
      xAxis: {
        type: 'category',
        axisLine: { show: false },
        axisTick: { show: false },
      },
      yAxis: {
        type: 'value',
        axisLine: { show: false },
        axisTick: { show: false },
        splitLine: {
          lineStyle: { color: '#F0F0F0' },
        },
      },
      series: [
        {
          type: 'bar',
          barWidth: '60%',
          itemStyle: {
            normal: {
              label: {
                show: true, // 开启显示
                position: 'top', // 在上方显示
                textStyle: {
                  // 数值样式
                  color: 'black',
                  fontSize: 12,
                },
              },
            },
          },
        },
      ],
    }
  }
}
